Skip to content

Add GitHub Action for JavaScript type checking via TypeScript#11131

Open
westonruter wants to merge 7 commits intoWordPress:trunkfrom
westonruter:trac-64662
Open

Add GitHub Action for JavaScript type checking via TypeScript#11131
westonruter wants to merge 7 commits intoWordPress:trunkfrom
westonruter:trac-64662

Conversation

@westonruter
Copy link
Member

@westonruter westonruter commented Mar 3, 2026

This introduces a new GitHub Action workflow for JavaScript type checking, mirroring the implementation for PHPStan. It also adds a typecheck:js Grunt task and includes it in the precommit:js task list.

Trac ticket: https://core.trac.wordpress.org/ticket/64662

Use of AI Tools

Initial commit authored by Gemini CLI with prompt:

Take a look at https://core.trac.wordpress.org/ticket/64662 and implement. You can see that typecheck:js npm script was added in b6c1bb7. Similarly, you can see in 8a82e67 how typecheck:php was introduced for PHPStan and a GitHub action was added to automatically run. What was done for PHPStan, implement similarly for TypeScript.

And:

Is installing composer and building WP really necessary?


This Pull Request is for code review only. Please keep all other discussion in the Trac ticket. Do not merge this Pull Request. See GitHub Pull Requests for Code Review in the Core Handbook for more details.

westonruter and others added 2 commits March 3, 2026 12:46
This introduces a new GitHub Action workflow for JavaScript type checking, mirroring the implementation for PHPStan.
It also adds a `typecheck:js` Grunt task and includes it in the `precommit:js` task list.

Co-authored-by: gemini-cli <176961590+gemini-code-assist[bot]@users.noreply.github.com>
Remove unnecessary PHP, Composer, and build steps since `tsc --build` only requires npm dependencies and the source JavaScript files.

Co-authored-by: gemini-cli <176961590+gemini-code-assist[bot]@users.noreply.github.com>
@westonruter westonruter marked this pull request as ready for review March 3, 2026 20:57
@github-actions
Copy link

github-actions bot commented Mar 3, 2026

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

Core Committers: Use this line as a base for the props when committing in SVN:

Props westonruter, jonsurrell.

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@westonruter westonruter changed the title Add GitHub Action for JavaScript type checking. Add GitHub Action for JavaScript type checking via TypeScript Mar 3, 2026
@westonruter
Copy link
Member Author

Difference between reusable-phpstan-static-analysis.yml and reusable-javascript-type-checking.yml:

--- .github/workflows/reusable-phpstan-static-analysis.yml	2026-02-27 14:51:55
+++ .github/workflows/reusable-javascript-type-checking.yml	2026-03-03 12:50:29
@@ -1,38 +1,31 @@
 ##
-# A reusable workflow that runs PHP Static Analysis tests.
+# A reusable workflow that runs JavaScript Type Checking.
 ##
-name: PHP Static Analysis
+name: JavaScript Type Checking
 
 on:
   workflow_call:
-    inputs:
-      php-version:
-        description: 'The PHP version to use.'
-        required: false
-        type: 'string'
-        default: 'latest'
 
 # Disable permissions for all available scopes by default.
 # Any needed permissions should be configured at the job level.
 permissions: {}
 
 jobs:
-  # Runs PHP static analysis tests.
+  # Runs JavaScript type checking.
   #
   # Violations are reported inline with annotations.
   #
   # Performs the following steps:
   # - Checks out the repository.
-  # - Sets up PHP.
+  # - Sets up Node.js.
   # - Logs debug information.
-  # - Installs Composer dependencies.
-  # - Configures caching for PHP static analysis scans.
-  # - Make Composer packages available globally.
-  # - Runs PHPStan static analysis (with Pull Request annotations).
-  # - Saves the PHPStan result cache.
+  # - Installs npm dependencies.
+  # - Configures caching for TypeScript build info.
+  # - Runs JavaScript type checking.
+  # - Saves the TypeScript build info.
   # - Ensures version-controlled files are not modified or deleted.
-  phpstan:
-    name: Run PHP static analysis
+  typecheck:
+    name: Run JavaScript type checking
     runs-on: ubuntu-24.04
     permissions:
       contents: read
@@ -51,59 +44,33 @@
           node-version-file: '.nvmrc'
           cache: npm
 
-      - name: Set up PHP
-        uses: shivammathur/setup-php@20529878ed81ef8e78ddf08b480401e6101a850f # v2.35.3
-        with:
-          php-version: ${{ inputs.php-version }}
-          coverage: none
-          tools: cs2pr
-
-      # This date is used to ensure that the Composer cache is cleared at least once every week.
-      # http://man7.org/linux/man-pages/man1/date.1.html
-      - name: "Get last Monday's date"
-        id: get-date
-        run: echo "date=$(/bin/date -u --date='last Mon' "+%F")" >> "$GITHUB_OUTPUT"
-
-      - name: General debug information
+      - name: Log debug information
         run: |
           npm --version
           node --version
-          composer --version
 
-      # Since Composer dependencies are installed using `composer update` and no lock file is in version control,
-      # passing a custom cache suffix ensures that the cache is flushed at least once per week.
-      - name: Install Composer dependencies
-        uses: ramsey/composer-install@3cf229dc2919194e9e36783941438d17239e8520 # v3.1.1
-        with:
-          custom-cache-suffix: ${{ steps.get-date.outputs.date }}
-
-      - name: Make Composer packages available globally
-        run: echo "${PWD}/vendor/bin" >> "$GITHUB_PATH"
-
       - name: Install npm dependencies
         run: npm ci --ignore-scripts
 
-      - name: Build WordPress
-        run: npm run build:dev
-
-      - name: Cache PHP Static Analysis scan cache
+      - name: Cache TypeScript build info
         uses: actions/cache@0057852bfaa89a56745cba8c7296529d2fc39830 # v4.3.0
         with:
-          path: .cache # This is defined in the base.neon file.
-          key: "phpstan-result-cache-${{ github.run_id }}"
+          path: |
+            *.tsbuildinfo
+          key: "ts-build-info-${{ github.run_id }}"
           restore-keys: |
-            phpstan-result-cache-
+            ts-build-info-
 
-      - name: Run PHP static analysis tests
-        id: phpstan
-        run: composer run phpstan -- -vvv --error-format=checkstyle | cs2pr --errors-as-warnings --graceful-warnings
+      - name: Run JavaScript type checking
+        run: npm run typecheck:js
 
       - name: "Save result cache"
         uses: actions/cache@0057852bfaa89a56745cba8c7296529d2fc39830 # v4.3.0
         if: ${{ !cancelled() }}
         with:
-          path: .cache
-          key: "phpstan-result-cache-${{ github.run_id }}"
+          path: |
+            *.tsbuildinfo
+          key: "ts-build-info-${{ github.run_id }}"
 
       - name: Ensure version-controlled files are not modified or deleted
         run: git diff --exit-code

@westonruter
Copy link
Member Author

westonruter commented Mar 3, 2026

Difference between .github/workflows/phpstan-static-analysis.yml and .github/workflows/javascript-type-checking.yml:

--- .github/workflows/phpstan-static-analysis.yml	2026-03-03 13:01:11
+++ .github/workflows/javascript-type-checking.yml	2026-03-03 12:50:49
@@ -1,7 +1,7 @@
-name: PHPStan Static Analysis
+name: JavaScript Type Checking
 
 on:
-  # PHPStan testing was introduced in 7.0.0.
+  # JavaScript type checking was introduced in 7.0.0.
   push:
     branches:
       - trunk
@@ -14,17 +14,18 @@
       - trunk
       - '[7-9].[0-9]'
     paths:
-      # This workflow only scans PHP files.
-      - '**.php'
-      # These files configure Composer. Changes could affect the outcome.
-      - 'composer.*'
-      # These files configure PHPStan. Changes could affect the outcome.
-      - 'phpstan.neon.dist'
-      - 'tests/phpstan/base.neon'
-      - 'tests/phpstan/baseline.php'
+      # This workflow only scans JavaScript files.
+      - '**.js'
+      # These files configure npm. Changes could affect the outcome.
+      - 'package*.json'
+      - '.nvmrc'
+      # This file configures TypeScript. Changes could affect the outcome.
+      - 'tsconfig.json'
+      # This directory contains TypeScript definitions. Changes could affect the outcome.
+      - 'typings/**'
       # Confirm any changes to relevant workflow files.
-      - '.github/workflows/phpstan-static-analysis.yml'
-      - '.github/workflows/reusable-phpstan-static-analysis.yml'
+      - '.github/workflows/javascript-type-checking.yml'
+      - '.github/workflows/reusable-javascript-type-checking.yml'
   workflow_dispatch:
 
 # Cancels all previous workflow runs for pull requests that have not completed.
@@ -39,10 +40,10 @@
 permissions: {}
 
 jobs:
-  # Runs PHPStan Static Analysis.
-  phpstan:
-    name: PHP static analysis
-    uses: ./.github/workflows/reusable-phpstan-static-analysis.yml
+  # Runs JavaScript type checking.
+  typecheck:
+    name: JavaScript type checking
+    uses: ./.github/workflows/reusable-javascript-type-checking.yml
     permissions:
       contents: read
     if: ${{ github.repository == 'WordPress/wordpress-develop' || ( github.event_name == 'pull_request' && github.actor != 'dependabot[bot]' ) }}
@@ -53,7 +54,7 @@
     permissions:
       actions: read
       contents: read
-    needs: [ phpstan ]
+    needs: [ typecheck ]
     if: ${{ github.repository == 'WordPress/wordpress-develop' && github.event_name != 'pull_request' && always() }}
     with:
       calling_status: ${{ contains( needs.*.result, 'cancelled' ) && 'cancelled' || contains( needs.*.result, 'failure' ) && 'failure' || 'success' }}

Use actions/github-script@v8.0.0 to match other workflows.

Co-authored-by: gemini-cli <176961590+gemini-code-assist[bot]@users.noreply.github.com>
@github-actions
Copy link

github-actions bot commented Mar 3, 2026

Test using WordPress Playground

The changes in this pull request can previewed and tested using a WordPress Playground instance.

WordPress Playground is an experimental project that creates a full WordPress instance entirely within the browser.

Some things to be aware of

  • All changes will be lost when closing a tab with a Playground instance.
  • All changes will be lost when refreshing the page.
  • A fresh instance is created each time the link below is clicked.
  • Every time this pull request is updated, a new ZIP file containing all changes is created. If changes are not reflected in the Playground instance,
    it's possible that the most recent build failed, or has not completed. Check the list of workflow runs to be sure.

For more details about these limitations and more, check out the Limitations page in the WordPress Playground documentation.

Test this pull request with WordPress Playground.

@westonruter westonruter requested a review from sirreal March 3, 2026 21:03
steps:
- name: Dispatch workflow run
uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7.0.1
uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8.0.0
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For some reason this hadn't been updated to match all of the other workflows.

@westonruter
Copy link
Member Author

When a TypeScript error occurs (e.g. d2ad278), the job fails as expected:

image
image

And the errors are annotated in the PR:

image

This is in contrast with PHPStan's analysis which does not fail its job when there are errors, but instead the errors are annotated as warnings.

I think this is fine given that TypeScript checking is being incrementally added to files on an opt-in basis. (Personally I would have wanted PHPStan errors to also cause jobs to fail with error annotations.)

@westonruter
Copy link
Member Author

Also, running npx grunt precommit:js with d2ad278 staged:

...
image

Copy link

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds JavaScript/TypeScript type-checking to the existing tooling and CI setup, following the established pattern used for PHPStan in this repository.

Changes:

  • Adds a grunt typecheck:js task and includes it in precommit:js.
  • Introduces a reusable GitHub Actions workflow that runs npm run typecheck:js (with caching for *.tsbuildinfo).
  • Adds a dedicated “JavaScript Type Checking” workflow that calls the reusable workflow, and bumps actions/github-script in the PHPStan workflow to v8.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.

File Description
Gruntfile.js Adds a Grunt wrapper task for JS type-checking and runs it as part of the JS precommit task set.
.github/workflows/reusable-javascript-type-checking.yml New reusable workflow to run TypeScript type-checking and cache .tsbuildinfo.
.github/workflows/javascript-type-checking.yml New entrypoint workflow wiring triggers/concurrency/notifications to the reusable typecheck workflow.
.github/workflows/phpstan-static-analysis.yml Updates actions/github-script pin to v8.0.0.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

jobs:
# Runs JavaScript type checking.
#
# Violations are reported inline with annotations.
Copy link

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The header comment says “Violations are reported inline with annotations”, but this workflow currently just runs npm run typecheck:js without configuring a TypeScript problem matcher or converting output to an annotation format (like cs2pr is used for PHPStan). Either update the comment to reflect that annotations aren’t provided, or add a matcher/formatter so the claim is accurate.

Suggested change
# Violations are reported inline with annotations.
# Violations are reported in the workflow logs.

Copilot uses AI. Check for mistakes.
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think this is correct. Inline annotations are working as seen in #11131 (comment)

Copy link
Member

@sirreal sirreal left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks good, thank you. I've left a few suggestions at your discretion.

Comment on lines +2013 to +2017
grunt.registerTask( 'typecheck:js', 'Runs TypeScript type checking.', function() {
var done = this.async();

grunt.util.spawn( {
cmd: 'npm',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

npm run grunt -- typecheck:js works as expected

westonruter and others added 2 commits March 4, 2026 01:29
Co-authored-by: Jon Surrell <sirreal@users.noreply.github.com>
Co-authored-by: Jon Surrell <sirreal@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants